html {
  height: 100%;
}

body {
  height: 100%;
  display: flex;
  flex-direction: column;
}

#header {
  width: 100%;
  height: 1.2rem;
  background: #ff841d;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#header h1 {
  color: #fff;
  font-size: .426667rem
}

#header a img {
  width: .613333rem;
}

#body {
  flex: 1;
  height: 16.330133rem;
  width: 10rem;
  overflow: hidden;
}

#body ul li {
  font-size: .426667rem;
  width: 48%;
  /* height: 8.216216216rem; */
  border: .053333rem solid #f7f7f7;
  font-size: .426667rem;
  float: left;
}

#body ul li a {
  display: block;
  padding: .266667rem .213333rem;
  color: red;
}

#body ul li a img {
  display: inline-block;
  width: 3.733333rem;
  height: 3.733333rem;
  padding: .8rem 0 0 .4rem;
}

#body ul li a h5 {
  color: #49495d;
  margin: .133333rem 0;
}

#body ul li a p {
  color: #ff9543;
  margin: 0 0 .266667rem;
}

#body ul li a span {
  display: block;
  color: #9d9d9d;
}

#footer {
  height: 1.946667rem;
  background: #efefef;
  text-align: center;
  display: flex;
  flex-direction: column;
}

#footer a,
#footer span {
  display: inline-block;
}

#footer ul {
  display: flex;
  /* justify-content: space-around; */
}

#footer ul li {
  flex: 1;
  border: .026667rem solid #d1d1d1;
}

#footer ul li a {
  font: .266667rem/.586667rem "";
  color: #4d4d4d;
  /* padding:0 1.284rem; */
}

.footer-bottom {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

#footer .footer-bottom a {
  font-size: .266667rem;
  color: #fc2323;
}

#footer .footer-bottom span:nth-of-type(1) {
  font-size: .266667rem;
  color: #2f2f2f;
}

#footer .footer-bottom span:nth-of-type(2) {
  font-size: .266667rem;
  color: #6f6f6f;
}

#footer .footer-bottom p {
  font-size: .186667rem;
  color: #8a8c96;
}